<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<link href='http://fonts.googleapis.com/css?family=Exo+2:400,300' rel='stylesheet' type='text/css'>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<html class="no-js">

	<head>
		<meta charset="utf-8"/>
		<title>CHIRIBOOK</title>
		<link rel="stylesheet" media="all" href="css/style.css"/>
		<meta name="viewport" content="width=device-width, initial-scale=1"/>
		<!-- Adding "maximum-scale=1" fixes the Mobile Safari auto-zoom bug: http://filamentgroup.com/examples/iosScaleBug/ -->
		
		
		<!-- JS -->
		<script src="js/jquery-1.6.4.min.js"></script>
		<script src="js/css3-mediaqueries.js"></script>
		<script src="js/custom.js"></script>
		<script src="js/tabs.js"></script>
		
		<!-- Tweet -->
		<link rel="stylesheet" href="css/jquery.tweet.css" media="all"  /> 
		<script src="js/tweet/jquery.tweet.js" ></script> 
		<!-- ENDS Tweet -->
		
		<!-- superfish -->
		<link rel="stylesheet" media="screen" href="css/superfish.css" /> 
		<script  src="js/superfish-1.4.8/js/hoverIntent.js"></script>
		<script  src="js/superfish-1.4.8/js/superfish.js"></script>
		<script  src="js/superfish-1.4.8/js/supersubs.js"></script>
		<!-- ENDS superfish -->
		
		<!-- prettyPhoto -->
		<script  src="js/prettyPhoto/js/jquery.prettyPhoto.js"></script>
		<link rel="stylesheet" href="js/prettyPhoto/css/prettyPhoto.css"  media="screen" />
		<!-- ENDS prettyPhoto -->
		
		<!-- poshytip -->
		<link rel="stylesheet" href="js/poshytip-1.1/src/tip-twitter/tip-twitter.css"  />
		<link rel="stylesheet" href="js/poshytip-1.1/src/tip-yellowsimple/tip-yellowsimple.css"  />
		<script  src="js/poshytip-1.1/src/jquery.poshytip.min.js"></script>
		<!-- ENDS poshytip -->
		
		<!-- GOOGLE FONTS -->
		<link href='http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz:400,300' rel='stylesheet' type='text/css'>
		
		<!-- Flex Slider -->
		<link rel="stylesheet" href="css/flexslider.css" >
		<script src="js/jquery.flexslider-min.js"></script>
		<!-- ENDS Flex Slider -->
		
		<!-- Less framework -->
		<link rel="stylesheet" media="all" href="css/lessframework.css"/>
		
		<!-- modernizr -->
		<script src="js/modernizr.js"></script>
		
		<!-- SKIN -->
		<link rel="stylesheet" media="all" href="css/skin.css"/>
		

	</head>
	
	<body lang="en">
	
            
		<header class="clearfix">
			<div class="wrapper">
				<a href="index.html" id="logo"><img  src="img/logo.png" alt="Zeni"></a>
                        <div id="combo-holder"></div>
			</div>
		</header>
		
		<!-- MAIN -->
		<div id="main">	
			<div class="wrapper clearfix">
			
				
				<h2 class="page-heading"><span>LOGIN</span></h2>	
	        	
				<!-- page content -->
	        	<div id="page-content" class="clearfix">
				
                        <br>
                        <br>
<?php
if (!empty($_POST)){
/****************************************
**establecemos conexion con el servidor.
**nombre del servidor: localhost.
**Nombre de usuario: root.
**Contraseña de usuario: root.
**Si la conexion fallara mandamos un msj 'ha fallado la conexion'**/
require_once('Connections/bd_chiribook.php');

/*Luego hacemos la conexión a la base de datos. 
**De igual manera mandamos un msj si hay algun error*/
$link = mysql_connect('127.0.0.1', 'root', '')
    or die('No se pudo conectar: ' . mysql_error());
mysql_select_db('chiribook') or die('No se pudo seleccionar la base de datos');
 
/*caturamos nuestros datos que fueron enviados desde el formulario mediante el metodo POST
**y los almacenamos en variables.*/
$usuario = $_POST["username"]; 

$password = md5( $_POST["password"]);

/*Consulta de mysql con la que indicamos que necesitamos que seleccione
**solo los campos que tenga como nombre_usernameistrador el que el formulario
**le ha enviado*/
$result = mysql_query("SELECT * FROM usuario WHERE username = '$usuario'");

//Validamos si el nombre del usuario existe en la base de datos o es correcto
if($row = mysql_fetch_array($result))
{     
//Si el usuario es correcto ahora validamos su contraseña
 if($row["password"] == $password)
 {
  //Creamos sesión
  session_start();  
  //Almacenamos el nombre de usuario en una variable de sesión usuario
  $_SESSION['usuario'] = $usuario;  
  //Redireccionamos a la pagina: index.php
  header("Location: blog.php");  
 }
 else
 {
  //En caso que la contraseña sea incorrecta enviamos un msj y redireccionamos a login.php
  ?>
   <script languaje="javascript">
    alert("Contraseña Incorrecta");
    location.href = "index.php";
   </script>
  <?php
            
 }
}
else
{
 //en caso que el nombre de username es incorrecto enviamos un msj y redireccionamos a login.php
?>
 <script languaje="javascript">
  alert("El nombre de usuario es incorrecto!");
  location.href = "index.php";
 </script>
<?php 
        
}

//Mysql_free_result() se usa para liberar la memoria empleada al realizar una consulta
mysql_free_result($result);

/*Mysql_close() se usa para cerrar la conexión a la Base de datos y es 
**necesario hacerlo para no sobrecargar al servidor, bueno en el caso de
**programar una aplicación que tendrá muchas visitas ;) .*/
mysql_close();

}else{
    

echo "<script type='text/javascript' src='js/validarlogin.js'></script>";
?>
					<form id='loginform' name='form1' action='index.php' method='post'>
						<h2 class='heading'>Registrese en CHIRIBOOK</h2>
						<p>Registrese para poder disfrutar de mayores ventajas</p>
						<fieldset>
							<div>
								<input name='username'  id='username' type='text' class='form-poshytip' title='Login name' />
								<label>*Username</label>
							</div>
							<div>
								
								<input name='password'  id='password' type='password'size=24 class='form-poshytip' title='Pasword' />
								<label>*Password</label>
							</div>
                                                      <p><input type='submit' value='ENTRA' name='submit' id='submit' /> <span id='error' class='warning'>Message</span></p>
						</fieldset>
                                        </form>
                                                <!-- contact sidebar -->
                                                
                                                <aside id='contact-sidebar'>
		        		<div class='block'>
			        		<h4>Instrucciones</h4>
                                                <br>
			        		<p>Todos los campos que estan marcados con * son necesarios para registrarse.</p>
                                            <p>Al hacer click en el botón Register acepta nuestros terminos y condiciones.</p>
                                        </div>
		        	</aside>
		        	<div class='clearfix'></div>
    

<?php
                                                
}

?>
